<template>
	<view >

    <navbar fixed leftIcon="left" title="交易详情" shadow></navbar>
    <view class="p-t-21 p-b-21 p-l-15 p-r-15 bg-fff m-l-18 m-r-18 m-t-12 m-b-10" style="border-radius: 19px;">
        <view class="view flex-row align-center justify-between m-b-20">
          <view class="c_949 fz-12 w60">发送人</view>
          <view class="c_3c3 fz-12 w200" style="word-break:break-all;">0x3cd751e6b0078be393132286c442345e5dc49699</view>
        </view>

        <view class="view flex-row align-center justify-between">
          <view class="c_949 fz-12 w60">接收人</view>
          <view class="c_3c3 fz-12 w200" style="word-break:break-all;">0x79b5b4805beeefd303fcf89b65db68e056b52a03</view>
        </view>
    </view>
     
     <view class="p-t-21 p-b-21 p-l-15 p-r-15 bg-fff m-l-18 m-r-18 m-t-12 " style="border-radius: 19px;">
       <view class="view flex-row align-center justify-between m-b-20">
          <view class="c_949 fz-12 w60">交易数量</view>
          <view class="c_3c3 fz-12 w200 text-right" style="word-break:break-all;">0ThkSwapRouter01</view>
        </view>

        <view class="view flex-row align-center justify-between  m-b-32">
          <view class="c_949 fz-12 w60">交易时间</view>
          <view class="c_3c3 fz-12 w200 text-right" style="word-break:break-all;">2022-02-19 22:39:39</view>
        </view>

        <view class="view flex-row align-center justify-between m-b-32">
          <view class="c_949 fz-12 w60">交易类型</view>
          <view class="c_3c3 fz-12 w200 text-right" style="word-break:break-all;">转入</view>
        </view>

        <view class="view flex-row align-center justify-between">
          <view class="c_949 fz-12 w60"></view>
          <view class="c_3c3 fz-12 w200 text-right" style="word-break:break-all;">0xb5d85CBf7cB3EE0D56b3bB207D
5Fc4B82f43F511</view>
        </view>
     </view>
	</view>
</template>

<script>
  import liuyunoTabs from '@/components/liuyuno-tabs/liuyuno-tabs.vue'
  import navbar from '@/components/uni-nav-bar'
  import noData from '@/components/noData/noData'
  import sibList from '@/components/sib-list/sib-list.vue'
	export default {
    components: {
      noData,
      sibList,
      navbar,
      liuyunoTabs
		},
		data() {
			return {
        tabs: ['投票收益','发放记录','发放记录'],
        defaultIndex: 0,
        active: 0,
        list: [],
        page: 1,
        rows: 10,
        total: 0,
        more: 'more',
        items: [
          {name: '已完成', key: 0},
          {name: '已作废' , key: 1}
        ],
        showSelect: false
			}
    },
    
    mounted() {
      this.getList(true)
    },
		methods: {
      hideSelect() {
        this.$refs.selector.bodyCloseMenus()
      },
			touchstart: function(e) {
				this.$refs.sibList.refreshStart(e);
			},
			touchmove: function(e) {
				this.$refs.sibList.refreshMove(e);
			},
			touchend: function(e) {
				this.$refs.sibList.refreshEnd(e);
      },
      getScrollH() {
        return uni.getSystemInfoSync() - 80 + 'px'
      },
			isRefresh: function() {
        const _this = this
				setTimeout(() => {
					uni.showToast({
						icon: 'success',
						title: '刷新成功'
					})
					// const defaultData = [
					// 	'初始数据1', '初始数据2', '初始数据3', '初始数据4',
					// 	'初始数据5', '初始数据6'
					// ]
          // _this.list = defaultData
          this.getList(true, () => {
            this.$refs.sibList.endAfter()
          })
					// 刷新结束调用
				}, 1000)
			},
			scrolltolowerFn: function() {
        if (this.list.length == this.total) {
          return false
        }
				uni.showLoading({
					title: '加载中...',
					mask: true
				})
				// 模拟请求
				const _this = this
				setTimeout(() => {
					// 请求成功
					this.getList(null, () => {
            uni.hideLoading()
          })
					
				}, 1000)
			},
      changeIndex(i) {
        this.active = i
        this.getList(true)
      },
      getList(isReflush, cb) {
        if (isReflush) {
          this.page = 1
        } else {
          this.page++
        }
        this.app.post({
          data: {
            status: this.active + 1,
            page: this.page,
            limit: this.rows
          },
          url: 'index.php/api/index/getOrderLogData'
        }, (res) => {
            if (cb) {
              cb()
            }
            if (res.data && res.data.data) {
                if (this.page == 1) {
                  this.list = res.data.data.value
                  if (res.data.count) {
                    this.total = res.data.count.value
                  }
                  
                } else {
            
                  this.list = [...this.list, ...res.data.data.value]
                }
            }
            
        })
      },
			onNavigationBarButtonTap(e) {
          if (e.index == 0) {
            this.showSelect = true
          }       
      },
		}
	}
</script>

<style lang="scss" scoped>
page {
    background-color:#F6F6F6;
    box-sizing: border-box;
    overflow-y: hidden;
		
  }
.bo {
  border:2px solid #343438;
}
.show-detail {
  border-radius: 60rpx;
}
/deep/.auto-h {
  height: calc(100vh - 220rpx) !important;
}
.autoH {height: calc(100vh - 220rpx);}
.bor-line {
  width: 100%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 50%, rgba(255, 255, 255, 0) 100%);
  opacity: 0.3;
  height: 1px;
}
/deep/.auto-h {height:calc(100vh - 90rpx)!important; }
 .bgs {
   background-position: center;
   background-size: cover;
   background-repeat: no-repeat;
 }
</style>
